<template>
  <el-container style="height: 500px; border: 1px solid #eee">
    <el-container>
      <el-aside class="el-aside" width="200px" style="background-color: #19374b">
        <v-menu/>
      </el-aside>
      <el-main class="elMain">
        <!-- 标题 -->
        <el-row class="lineHight90 margin060">
          <el-breadcrumb separator=">">
            <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
            <el-breadcrumb-item :to="{ path: '/' }">买家中心</el-breadcrumb-item>
            <el-breadcrumb-item>需求分析</el-breadcrumb-item>
          </el-breadcrumb>
        </el-row>
        <div class="width890 marginTop68">
          <el-steps :active="1">
            <el-step title="对接确认" icon="el-icon-edit"></el-step>
            <el-step title="合同确认" icon="el-icon-upload"></el-step>
            <el-step title="执行评价" icon="el-icon-picture"></el-step>
          </el-steps>
        </div>
       <!-- 需求基本信息 -->
        <el-row class="margin060 bgWhite marginTop40">
          <!-- 政策选择 -->
          <el-col :span="21" class="maginLeft170">
            <el-row class="itemTitle paddingLeft15 marginTop34 borderLeft marginBottom20">政策选择</el-row>
            <el-row>
              <el-col :span="8" class="marginTB20 marginTop20">
                <span class="itemTitle">项目名称</span> ：<span class="itemContent colorc1">苏州工业区储能项目 </span>
              </el-col>
               <el-col :span="8" class="marginTB20">
                <span class="itemTitle">项目类型</span> ：<span class="itemContent colorc1">建设安装 </span>
              </el-col>
               <el-col :span="8" class="marginTB20">
                <span class="itemTitle">专业类型</span> ：<span class="itemContent colorc1">电气-储能 </span>
              </el-col>
               <el-col :span="8" class="marginTB20">
                <span class="itemTitle">项目地点</span> ：<span class="itemContent colorc1">苏州工业区 </span>
              </el-col>
               <el-col :span="8" class="marginTB20">
                <span class="itemTitle">投资预算</span> ：<span class="itemContent colorc1">小于190万 </span>
              </el-col>
              <el-col :span="24" class="marginTB20">
                <el-row class="lineHeight28">
                  <el-col :span="1">描述：</el-col>
                  <el-col :span="22" class="colorc1">
                    通过开发物联网云平台，实现通过WEB端和APP端，监测影院激光光源产品设备的能耗、工作状态。实现远程控制，充值，故障报警灯功能，加强对设备信息管理，数据可视化显示。
                    加强对设备的运维工作,工单流程跟踪等
                  </el-col>
                </el-row>
              </el-col>
            </el-row>
          </el-col>
          <!-- 供应商信息 -->
          <el-col :span="21" class="maginLeft170">
            <el-row class="itemTitle paddingLeft15 marginTop34 borderLeft marginBottom20">供应商信息</el-row>
            <el-row>
              <el-col :span="8" class="marginTB20 marginTop20">
                <span class="itemTitle">企业名称</span> ：<span class="itemContent colorc1">远景能源（苏州）   </span>
              </el-col>
               <el-col :span="8" class="marginTB20">
                <span class="itemTitle">企业地点</span> ：<span class="itemContent colorc1">苏州  </span>
              </el-col>
               <el-col :span="8" class="marginTB20">
                <span class="itemTitle">企业LOGO</span> ：<span>
                  <div class="size82a13 imgContains displayInlineBlock">
                    <img src="../../assets/images/componyLogo.png" alt="">
                  </div>
                </span>
              </el-col>
               <el-col :span="8" class="marginTB20">
                <span class="itemTitle">项目负责人</span> ：<span class="itemContent colorc1">大牛牛的小弟      </span>
              </el-col>
               <el-col :span="8" class="marginTB20">
                <span class="itemTitle"> 联系方式</span> ：<span class="itemContent colorc1">1888888888 </span>
              </el-col>
            </el-row>
          </el-col>
        </el-row>
        <!-- 项目负责人 -->
        <el-row class="margin060 bgWhite marginTop40">
          <el-col :span="20" class="maginLeft170">
            <el-row class="itemTitle paddingLeft15 marginTop34 borderLeft marginBottom20">公司项目负责人</el-row>
            <el-row>
              <el-table
                :data="tableData3"
                border
                height="250"
                style="width: 100%">
                <el-table-column
                  prop="date"
                  align="center"
                  label="职位">
                </el-table-column>
                <el-table-column
                  prop="name"
                  align="center"
                  label="姓名">
                </el-table-column>
                <el-table-column
                  prop="address"
                  align="center"
                  label="联系方式">
                </el-table-column>
                <el-table-column
                  prop="edit"
                  align="center"
                  label="操作">
                  <template slot-scope="scope">
                    <el-button @click="handleClick(scope.row)" size="small">更新</el-button>
                    <el-button size="small">删除</el-button>
                  </template>
                </el-table-column>
              </el-table>
              <el-col :span="24">
                <el-row>
                  <el-col :span="6" :offset="18" class="textCenter border0 padding30">
                        <el-button type="primary">+添加</el-button>
                  </el-col>
                </el-row>
              </el-col>
            </el-row>
          </el-col>
        </el-row>
        <!-- 项目提资 -->
        <el-row class="margin060 bgWhite">
          <el-col :span="20" class="maginLeft170">
            <el-row class="itemTitle paddingLeft15 marginTop34 borderLeft marginBottom20">项目提资</el-row>
            <el-row>
              <el-table
                :data="projectEndowment"
                border
                height="250"
                style="width: 100%">
                <el-table-column
                  prop="demand"
                  align="center"
                  label="供应商收资需求">
                </el-table-column>
                <el-table-column
                  prop="uploadFile"
                  align="center"
                  label="文件名">
                  <template slot-scope="applyImmediately">
                    <el-button size="small" type="text">{{applyImmediately.row.uploadFile}}</el-button>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="date"
                  align="center"
                  label="上传时间">
                </el-table-column>
                <el-table-column
                  prop="edit"
                  align="center"
                  label="操作">
                  <template slot-scope="scope">
                    <el-button size="small">上传文件</el-button>
                  </template>
                </el-table-column>
              </el-table>
              <el-col :span="24">
                <el-row>
                  <el-col :span="6" :offset="18" class="textCenter border0 padding20">
                        <el-button>文件上传</el-button>
                  </el-col>
                </el-row>
              </el-col>
            </el-row>
          </el-col>
        </el-row>
        <!-- 供应商项目策划方案 -->
        <el-row class="margin060 bgWhite">
          <el-col :span="20" class="maginLeft170">
            <el-row class="itemTitle paddingLeft15 marginTop34 borderLeft marginBottom20">供应商项目策划方案</el-row>
            <el-row>
              <el-table
                :data="projectPlanning"
                border
                height="250"
                style="width: 100%">
                <el-table-column
                  prop="planningdemand"
                  align="center"
                  label="要求供应商提供">
                </el-table-column>
                <el-table-column
                  prop="planninguploadFile"
                  align="center"
                  label="文件名">
                  <template slot-scope="planning">
                    <el-button size="small" type="text">{{planning.row.planninguploadFile}}</el-button>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="planningdate"
                  align="center"
                  label="上传时间">
                </el-table-column>
                <el-table-column
                  prop="edit"
                  align="center"
                  label="操作">
                  <template slot-scope="scope">
                    <el-button size="small">下载文件</el-button>
                  </template>
                </el-table-column>
              </el-table>
              <el-col :span="24">
                <el-row>
                  <el-col :span="6" :offset="18" class="textCenter border0 padding20">
                        <el-button>添加需求</el-button>
                  </el-col>
                </el-row>
              </el-col>
            </el-row>
          </el-col>
        </el-row>
        <!-- 确认按钮 -->
        <el-row class="margin060 paddingBottom20 marginTop20">
          <el-col :span="24" class="textCenter">
            <el-button>项目关闭</el-button>
            <el-button type="primary">项目确认</el-button>
          </el-col>
        </el-row>
      </el-main>
    </el-container>
  </el-container>
</template>
<style scoped>

</style>
<script>
  import VMenu from '../../layout/default/components/menu'
export default {
  name: "Analysis",
  components: {
    VMenu
  },
  data() {
    return{
     active:1,//步骤
     //公司项目负责人数据
     tableData3: [
          {
            date: '项目负责人',
            name: '王小虎',
            address: '13435663802'
          },{
            date: '项目负责人',
            name: '王小虎',
            address: '13435663802'
          },{
            date: '项目负责人',
            name: '王小虎',
            address: '13435663802'
          },{
            date: '项目负责人',
            name: '王小虎',
            address: '13435663802'
          }
        ],
        //项目提资数据
        projectEndowment:[
          {
            demand: '项目需求情况',
            uploadFile: '文件上传',
            date: '2019-05-06'
          }
        ],
        //供应商项目策划方案 
        projectPlanning:[
          {
            planningdemand: '项目需求情况',
            planninguploadFile: '文件上传',
            planningdate: '2019-05-06'
          }
        ],
    }
  },
  methods: {
    handleOpen(key, keyPath) {
      console.log(key, keyPath);
    },
    handleClose(key, keyPath) {
      console.log(key, keyPath);
    }
  }
};
</script>

